.tw-bpms-wrapper {
  // 流程设计器
  .process-designer-wrapper {
    height: 100%;
    background-color: #ffffff;

    .ml10 {
      margin-left: 10px;
    }

    .flip-horizontal {
      display: inline-block;
      -moz-transform: scaleX(-1);
      -webkit-transform: scaleX(-1);
      -o-transform: scaleX(-1);
      transform: scaleX(-1);
    }

    .process-designer__container {
      display: inline-flex;
      flex: 1;
      width: 100%;
      height: 100%;
      margin-top: 5px;

      .process-designer-canvas {
        flex: 1;
        position: relative;
        height: calc(100% - 30px);
        background: url('')
          repeat;

        div.bts-toggle-mode {
          display: none;
        }

        .djs-minimap {
          font-size: 12px;
        }
      }
    }

    .align {
      &.align-left {
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
      }

      &.align-right {
        transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
      }

      &.align-top {
        transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
      }

      &.align-bottom {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
      }

      &.align-vertical {
        transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
      }

      &.align-horizontal {
        transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
      }
    }
  }

  // 流程属性面板
  .process-panel__container {
    height: 100%;
    background-color: #ffffff;

    .mt10 {
      margin-top: 10px;
    }

    .el-collapse-item__header {
      padding-left: 10px;
      font-size: 14px;
      font-weight: 600;
    }

    .process-panel-tab__content {
      padding: 0px 10px;

      .process-panel-tab__content-title {
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      .el-divider {
        margin: 10px 0px;
      }

      .process-icon {
        width: 15px;
        height: 15px;
        margin-right: 5px;
      }

      .el-form {
        .el-form-item {
          .el-select {
            width: 100%;
          }
        }
      }
    }
  }
}

.el-popper {
  &.process-designer {
    min-width: auto;

    .el-link {
      padding: 3px 0px;
      margin: 3px 0px;
    }
  }
}
